<!--
 * @Author: your name
 * @Date: 2021-08-04 16:05:39
 * @LastEditTime: 2021-11-08 11:05:15
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \jinfeng_up\src\views\task\taskDetails\taskDetails.vue
-->
<template>
  <div class="taskDetail">
    <!-- appendToBody -->
    <div class="header">
      <div class="headerLeft">
        <span class="leftBtn" @click="toTask"></span>
        <span class="leftTxt">任务总览 - 任务详情</span>
      </div>
      <div class="header_right header_btn" v-if="this.$route.query.productId">
        <el-button v-show="detailsForm.showCloseTag" type="primary" size="small" @click="closeRow" v-has="'M1109001'"
          >关闭</el-button
        >
        <el-button
          v-show="detailsForm.showActivationTag"
          type="primary"
          size="small"
          @click="activeRow"
          v-has="'M1109002'"
          >激活</el-button
        >
        <el-button
          v-show="detailsForm.showAssignTag"
          type="primary"
          size="small"
          @click="transferRow"
          v-has="'M1109003'"
          >转让</el-button
        >
        <el-button v-show="detailsForm.showConfirmTag" type="primary" size="small" @click="confirm" v-has="'M1109004'"
          >确认</el-button
        >
        <el-button type="primary" size="small" @click="updateRow" v-has="'M1109005'">更新进度</el-button>
        <el-button
          type="primary"
          size="small"
          v-show="detailsForm.showApplyMeeting"
          @click="applicationRow"
          v-has="'M1109006'"
          >申请上会</el-button
        >
      </div>
    </div>
    <div class="container">
      <div class="containerInfo">
        <el-row type="flex" class="row-bg" justify="space-between">
          <el-col :span="15">
            <div class="leftContainer">
              <div class="leftTop">
                <el-descriptions class="margin-top" :column="2" border>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 任务ID </template>
                    {{ detailsForm.id }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 所属产品 </template>
                    {{ detailsForm.productName }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 任务状态 </template>
                    {{ detailsForm.status | transferSeverity(taskStatusList) }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 关联反馈ID </template>
                    {{ detailsForm.feedBackId }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 任务标识 </template>
                    {{ detailsForm.ctag | transTags }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 计划完成时间 </template>
                    {{ detailsForm.expectedCompletedDate }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 当前责任人 </template>
                    {{ detailsForm.responsibleUserName }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 责任人部门 </template>
                    {{ detailsForm.responsibleUserDept }}
                  </el-descriptions-item>

                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 创建人 </template>
                    {{ detailsForm.createUserName }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 创建人部门 </template>
                    {{ detailsForm.createUserDep }}
                  </el-descriptions-item>
                  <el-descriptions-item :labelStyle="label_style" :contentStyle="content_style">
                    <template slot="label"> 跟踪事项 </template>
                    <!-- <el-input v-model="detailsForm.trackingTip" :rows="4" type="textarea" disabled></el-input> -->
                    <div @click="aboutDetailImage">
                      <quill-editor @ready="onEditorReady($event)" v-model="detailsForm.trackingTip" @focus="focustip($event)" class="notShown">
                      </quill-editor>
                    </div>
                    <!-- <tinymceeditor
                    v-model="detailsForm.trackingTip"
                    :disabled="true"
                    ref="tinymceeditor"
                  /> -->
                  </el-descriptions-item>
                </el-descriptions>
              </div>
              <div class="leftBottom">
                <el-row type="flex" class="row-bg" justify="space-between">
                  <el-col :span="11" style="height:100%">
                    <el-card class="textCards" shadow="never">
                      <div class="detailTitle">超期会议</div>
                      <div v-for="(item, index) in aboutMettingData" :key="index">
                        <span>会议主题：{{ item }}</span>
                        <br />
                      </div>
                    </el-card>
                  </el-col>
                  <el-col :span="12">
                    <el-card class="textCardS" shadow="never">
                      <div class="detailTitle">任务处理时长信息</div>
                      <el-row v-if="detailsForm.ctag == 0">
                        <el-col :span="12">
                          <div>C1环激活次数</div>
                        </el-col>
                        <el-col :span="12">
                          <div>{{ detailsForm.c1ActiveCount }}次</div>
                        </el-col>
                      </el-row>
                      <el-row v-if="detailsForm.ctag == 0">
                        <el-col :span="12">
                          <div>C1环处理总时长</div>
                        </el-col>
                        <el-col :span="12">
                          <div>{{ detailsForm.c1DurationSecond }}</div>
                        </el-col>
                      </el-row>
                      <el-row v-if="detailsForm.ctag == 1">
                        <el-col :span="12">
                          <div>C2环激活次数</div>
                        </el-col>
                        <el-col :span="12">
                          <div>{{ detailsForm.c2ActiveCount }}次</div>
                        </el-col>
                      </el-row>
                      <el-row v-if="detailsForm.ctag == 1">
                        <el-col :span="12">
                          <div>C2环处理总时长</div>
                        </el-col>
                        <el-col :span="12">
                          <div>{{ detailsForm.c2DurationSecond }}</div>
                        </el-col>
                      </el-row>
                      <!-- 任务处理时长信息<br> C2环激活次数
                <br> 关闭任务
                <br> 任务处理时长信息 -->
                    </el-card>
                  </el-col>
                </el-row>
              </div>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="rightTop">
              <div class="detailTitle">任务进展记录区域</div>
              <ul>
                <li
                  v-for="(item, index) in taskOperationLogList"
                  :key="index"
                  class="underLineSty"
                  @dblclick="lookInLargeScreen(item.logContent)"
                >
                  <div class="logDetail">
                    <div class="logDetailHeader">
                      <span class="serialNum">{{ index + 1 }}</span>
                      <span>{{ item.createTime }}</span>
                    </div>
                    <div class="logDetailFooter" v-html="item.logContent"></div>
                  </div>
                </li>
              </ul>
            </div>
          </el-col>
        </el-row>
      </div>
    </div>
    <!-- 大图展示区域 -->
    <CommonDialog
      title="图片"
      width="75%"
      v-bind:dialogVisible="detailedContentDialogVisible"
      @on-change-dialogVisible="detailedContentChange"
      class="lookInfo"
      top="5vh"
    >
      <template #body>
        <div class="detailedContentDisplay" v-html="detailedContent">
          {{ detailedContent }}
        </div>
      </template>
    </CommonDialog>
    <!-- 弹出框汇总 -->
    <!-- 关闭弹出框 -->
    <CommonDialog
      title="关闭"
      width="75%"
      v-bind:dialogVisible="closeDialogVisible"
      @on-change-dialogVisible="closeChange"
      class="close"
      top="10vh"
    >
      <template #body>
        <el-form
          class="closeForm"
          :model="closeForm"
          ref="closeForm"
          :rules="closeFormRules"
          label-width="100"
          label-position="top"
        >
          <el-form-item label="关闭原因" class="closeReason" prop="reason">
            <el-select v-model="closeForm.reason" placeholder="关闭原因">
              <el-option
                v-for="(item, index) in closeReasonList"
                :key="index"
                :label="item.text"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="备注" class="extra closeReason" prop="remark">
            <socialUpload :contentDefault="closeForm.remark" @getContent="getCloseRemark"></socialUpload>
          </el-form-item>
        </el-form>
      </template>
      <template #dialog_footer>
        <el-button size="small" @click="closeCancel">取 消</el-button>
        <el-button type="primary" @click="confirmCloseRow('closeForm')" size="small">确认</el-button>
      </template>
    </CommonDialog>

    <!-- 激活弹出框 -->
    <CommonDialog
      title="激活"
      width="75%"
      v-bind:dialogVisible="isactiveDialogVisible"
      @on-change-dialogVisible="activeChange"
      class="startForm"
      top="10vh"
    >
      <template #body>
        <el-form :model="activeForm" label-position="top" ref="activeForm" :rules="activeFormRules" label-width="100">
          <el-form-item label="激活原因" prop="tips">
            <!-- <el-input type="textarea" v-model="activeForm.tips">
            </el-input> -->
            <socialUpload :contentDefault="activeForm.tips" @getContent="getActiveTips"></socialUpload>
          </el-form-item>
        </el-form>
      </template>

      <template #dialog_footer>
        <el-button size="small" @click="activeCancel">取 消</el-button>

        <el-button type="primary" @click="activeConfirm('activeForm')" size="small">确认</el-button>
      </template>
    </CommonDialog>

    <!-- 转让弹出框 -->
    <CommonDialog
      title="转让"
      width="75%"
      v-bind:dialogVisible="transferDialogVisible"
      @on-change-dialogVisible="transferChange"
      class="close"
      top="10vh"
    >
      <template #body>
        <el-form
          :model="transferForm"
          label-position="top"
          ref="transferForm"
          label-width="100"
          :rules="transferFormRules"
        >
          <el-row>
            <el-col :span="24">
              <el-form-item label="接收人" prop="userid">
                <el-select v-model="transferForm.userid">
                  <el-option v-for="item in transferUserList" :key="item.id" :label="item.name" :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="转让原因" prop="reason">
                <!-- <el-input type="textarea" v-model="transferForm.reason">
                </el-input> -->
                <socialUpload :contentDefault="transferForm.reason" @getContent="getTranSferReason"></socialUpload>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </template>

      <template #dialog_footer>
        <el-button size="small" @click="transferCancel">取 消</el-button>

        <el-button type="primary" size="small" @click="confirmtransfer('transferForm')">确认</el-button>
      </template>
    </CommonDialog>

    <!-- 更新进度弹出框 -->
    <CommonDialog
      title="更新进度"
      width="75%"
      v-bind:dialogVisible="updateDialogVisible"
      @on-change-dialogVisible="updateChange"
      class="activeForm"
      top="10vh"
    >
      <template #body>
        <el-form class="suspendForm" :model="updateForm" label-position="top" ref="updateForm" :rules="updateFormRules">
          <el-form-item label="任务详情" class="suspendReason" prop="context">
            <!-- <el-input type="textarea" v-model="updateForm.context">
            </el-input> -->
            <socialUpload :contentDefault="updateForm.context" @getContent="getUpdateContent"></socialUpload>
          </el-form-item>
        </el-form>
      </template>

      <template #dialog_footer>
        <el-button size="small" @click="updateCancel">取 消</el-button>

        <el-button type="primary" size="small" @click="confirmUpadte('updateForm')">确认</el-button>
      </template>
    </CommonDialog>
    <ApplicationDialog ref="ApplicationDialog" @refreshPage="onSearch" />
  </div>
</template>
<script>
/* 引入请求服务 */

import socialUpload from '@/components/socialUpload/socialUpload.vue'
import { taskPandect } from '@/api/tasks/server'
import { FeedBack } from '@/api/feedBack/server'
// import tinymceeditor from '@/components/tinymceEditer/tinymceEditer.vue'
/* 引入通用的弹出框 */
import CommonDialog from '../../../components/commonDialog/commonDialog.vue'
import ApplicationDialog from '@/components/taskApplicationDialog/taskApplicationDialog.vue'

export default {
    name: '',
    components: {
        CommonDialog,
        socialUpload,
        ApplicationDialog
    },
    props: {},
    data() {
        return {
            detailedContent: '',
            taskStatusList: [
                {
                    label: '新建',
                    value: 0
                },
                {
                    label: '处理中',
                    value: 1
                },
                {
                    label: '已完成',
                    value: 2
                }
            ],
            taskCommonId: '',

            detailsForm: {
                id: '', // 主键
                feedBackId: '', //	关联反馈主键
                productName: '', // 所属产品
                ctag: '', // 任务标识
                expectedCompletedDate: '', // 计划完成时间
                responsibleUser: '', // 责任人
                responsibleUserDept: '', // 责任人部门
                responsibleUserId: '', // 责任人id
                trackingTip: '', // 跟踪事项
                status: '' // 任务状态
            },
            taskOperationLogList: [],
            label_style: { width: '150px' },
            content_style: { width: '340px', userSelect: 'none' },

            /* 控制弹出框的显示或隐藏 */
            createTaskDialogVisible: false, // 创建
            closeDialogVisible: false, // 关闭
            isactiveDialogVisible: false, // 激活
            transferDialogVisible: false, // 转让
            updateDialogVisible: false, // 更新
            detailedContentDialogVisible: false, // 大图展示区域
            /* 弹出框表单验证规则 */
            /* 关闭 */
            closeFormRules: {
                reason: [{ required: true, message: '请输入关闭原因', trigger: 'change' }],
                remark: [{ required: false, message: '请输入备注', trigger: 'blur' }]
            },

            /* 激活 */
            activeFormRules: {
                tips: [{ required: true, message: '请输入激活原因', trigger: 'change' }]
            },

            /* 转让 */
            transferFormRules: {
                userid: [{ required: true, message: '请选择接收人', trigger: 'change' }],
                reason: [{ required: true, message: '请输入转让原因', trigger: 'blur' }]
            },

            /* 更新 */
            updateFormRules: {
                context: [{ required: true, message: '请输入跟踪事项', trigger: 'change' }]
            },

            /* 弹出框请求列表 */
            closeReasonList: [],
            // 转让人列表
            transferUserList: [],

            /* 弹出框表单 */
            // 创建
            createTaskForm: {
                productId: '',
                productName: '',
                taskStatus: '',
                TheirProducts: '',
                taskIdentity: 'C2',
                closingDate: '',
                currentResponsiblePerson: '',
                department: '',
                trackItems: ''
            },
            // 关闭
            closeForm: {
                reason: '',
                remark: '',
                solution: ''
            },
            // 激活
            activeForm: {
                tips: ''
            },
            // 转让
            transferForm: {
                reason: '',
                userid: ''
            },
            // 更新
            updateForm: {
                context: ''
            },

            // 超期会议数据
            aboutMettingData: []
        }
    },
    computed: {},
    watch: {},
    created() {},
    mounted() {
        this.queryTaskDetailById(this.$route.query.id)
        this.getcloseReasonList() // 任务关闭原因列表
    },
    filters: {
        transferSeverity(_val, _list) {
            let str = ''
            _list.findIndex(_item => {
                if (_item.value === _val) {
                    str = _item.label
                    return true
                } else {
                    return false
                }
            })
            return str
        },
        transTags(v) {
            if (v) {
                if (v == 0) {
                    return 'C1'
                } else {
                    return 'C2'
                }
            } else {
                return ''
            }
        }
    },

    methods: {
        detailedContentChange() {
            this.detailedContentDialogVisible = false
            this.detailedContent = ''
        },
        aboutDetailImage() {
            if (this.detailsForm.trackingTip.indexOf('<img') != -1) {
                const imgReg = /<img.*?(?:>|\/>)/gi
                const imgArray = this.detailsForm.trackingTip.match(imgReg)
                if (imgArray.length > 0) {
                    this.detailedContentDialogVisible = true
                }
                for (const i in imgArray) {
                    this.detailedContent += imgArray[i]
                }
            }
        },
        lookInLargeScreen(content) {
            // console.log(content)
            if (content.indexOf('<img') != -1) {
                const imgReg = /<img.*?(?:>|\/>)/gi
                this.detailedContentDialogVisible = true
                const imgArray = content.match(imgReg)
                for (const i in imgArray) {
                    this.detailedContent += imgArray[i]
                }
            }
        },
        onSearch() {
            this.queryTaskDetailById(this.$route.query.id)
        },
        /* 获取数据 */
        async queryTaskDetailById(id) {
            try {
                const result = await taskPandect.GetInfoByIdAsync(id)
                if (result.success) {
                    this.taskOperationLogList = result.data.taskOperationLogList
                    this.detailsForm = result.data
                    console.log('详情页面', result.data)
                    this.aboutMettingData = result.data.meetingList
                    // console.log('超期会议数据Data', this.aboutMettingData)
                    // console.log('详情页面日志详情data', result.data.taskOperationLogList)
                }
            } catch (err) {
                console.log(err)
            }
        },
        focustip(event) {
            event.enable(false) // 设置富文本编辑器不可编辑
        },
        onEditorReady(event) {
            event.enable(false) // 设置富文本编辑器不可编辑
        },
        /* 回到任务总览页面 */
        toTask() {
            if (this.$route.query.activeName != null) {
                if (this.$route.query.overRangeMetting != null) {
                    this.$router.push({
                        path:
              'myWait?activeName=' +
              this.$route.query.activeName +
              '&overRangeMetting=' +
              this.$route.query.overRangeMetting
                    })
                } else {
                    this.$router.push({
                        path: 'myWait?activeName=' + this.$route.query.activeName
                    })
                }
            } else {
                this.$router.go(-1)
            }
        },
        /* 弹出框的系列方法 */
        // 创建任务
        createTask() {
            this.createTaskDialogVisible = true
        },
        createTaskChange(val) {
            this.createTaskDialogVisible = val
        },
        /* 取消 新建任务  */
        createTaskCancel() {
            this.createTaskForm = {
                productId: '',
                productName: '',
                taskStatus: '',
                TheirProducts: '',
                taskIdentity: '',
                closingDate: '',
                currentResponsiblePerson: '',
                department: '',
                trackItems: ''
            }
            this.createTaskDialogVisible = false
        },
        // 关闭方法开始
        closeRow() {
            this.taskCommonId = this.$route.query.id
            this.closeDialogVisible = true
        },
        // 取消关闭
        closeCancel() {
            this.closeDialogVisible = false
        },
        // 回传关闭
        closeChange(val) {
            this.closeDialogVisible = val
            this.$refs['closeForm'].resetFields()
        },
        /* 获得任务关闭原因列表 */
        async getcloseReasonList() {
            try {
                const result = await taskPandect.GetTaskCloseReason()
                if (result.success) {
                    this.closeReasonList = result.data
                    // console.log('任务关闭原因', result.data)
                }
            } catch (err) {
                console.log(err)
            }
        },
        // 关闭 确认
        confirmCloseRow(formName) {
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    try {
                        const result = await taskPandect.CloseTask(this.closeForm, this.taskCommonId)
                        if (result.success) {
                            this.queryTaskDetailById(this.$route.query.id)
                            // console.log('关闭成功')
                            this.closeDialogVisible = false
                            this.$refs['closeForm'].resetFields()
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    return false
                }
            })
        },

        // 激活方法开始
        activeRow(val) {
            // console.log(val)
            this.taskCommonId = val
            this.isactiveDialogVisible = true
        },
        // 取消激活
        activeCancel() {
            this.isactiveDialogVisible = false
            this.$refs['activeForm'].resetFields()
        },

        // 回传激活
        activeChange(val) {
            this.isactiveDialogVisible = val
            this.$refs['activeForm'].resetFields()
        },

        // 激活 确认
        activeConfirm(formName) {
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    try {
                        const result = await taskPandect.Activation(this.activeForm, this.$route.query.id)
                        if (result.success) {
                            // console.log('激活确认成功')
                            this.queryTaskDetailById(this.$route.query.id)
                            this.activeForm = {
                                tips: ''
                            }
                            this.$refs[formName].resetFields()
                            this.isactiveDialogVisible = false
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },

        // 转让方法开始
        /* 点击转让的时候 ，同时根据产品ID查询指派人 */
        async transferRow() {
            this.transferDialogVisible = true
            this.transferUserList = []
            try {
                const result = await FeedBack.GetListItemAsync({
                    id: this.$route.query.productId
                })

                if (result.success) {
                    this.transferUserList = result.data
                    // console.log('Task_转让责任人', result.data)
                }
            } catch (err) {
                console.log(err)
            }
        },

        // 取消 转让
        transferCancel() {
            this.transferDialogVisible = false
            this.$refs['transferForm'].resetFields()
        },

        // 回传 转让
        transferChange(val) {
            this.transferDialogVisible = val
            this.$refs['transferForm'].resetFields()
        },

        // 转让 确认
        confirmtransfer(formName) {
            const objparams = {
                reason: this.transferForm.reason
            }
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    // console.log(objparams)
                    // console.log('验证通过')
                    try {
                        const result = await taskPandect.TransferTask(objparams, this.$route.query.id, this.transferForm.userid)
                        if (result.success) {
                            // console.log('转让成功')
                            this.queryTaskDetailById(this.$route.query.id)
                            this.transferForm = {
                                reason: '',
                                userid: ''
                            }
                            this.transferDialogVisible = false
                            this.$refs[formName].resetFields()
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },

        // 取消 更新
        updateCancel() {
            this.updateDialogVisible = false
            this.$refs['updateForm'].resetFields()
        },

        // 更新方法开始
        updateRow() {
            this.updateDialogVisible = true
        },

        // 回传 更新
        updateChange(val) {
            this.updateDialogVisible = val
            this.$refs['updateForm'].resetFields()
        },

        // 更新进度确认
        confirmUpadte(formName) {
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    // console.log('验证通过')
                    try {
                        const result = await taskPandect.UpdateProcess(this.updateForm, this.$route.query.id)
                        if (result.success) {
                            // console.log('更新进度成功')
                            this.queryTaskDetailById(this.$route.query.id)
                            this.updateForm = {
                                context: ''
                            }
                            this.$refs[formName].resetFields()
                            this.updateDialogVisible = false
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        /**
     * @description: 任务详情传值
     * @param {String} V 传入的编辑框绑定的值
     */
        getUpdateContent(V) {
            this.updateForm.context = V
        },
        /**
     * @description: 转让原因传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getTranSferReason(Value) {
            this.transferForm.reason = Value
        },
        /**
     * @description: 关闭备注传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getCloseRemark(Value) {
            this.closeForm.remark = Value
        },
        /**
     * @description: 跟踪事项传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getCreateTrack(Value) {
            this.createTaskForm.trackItems = Value
        },
        /**
     * @description: 跟踪事项传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getActiveTips(Value) {
            this.activeForm.tips = Value
        },

        // 整体任务确认
        async confirm() {
            try {
                const result = await taskPandect.ConfirmTask(this.$route.query.id)
                if (result.success) {
                    this.$message.success('您确认了任务')
                    this.queryTaskDetailById(this.$route.query.id)
                } else {
                    this.$message.error(result.message)
                }
            } catch (err) {
                console.log(err)
            }
        },
        applicationRow() {
            const str = JSON.stringify(this.detailsForm)
            this.$refs.ApplicationDialog.show(str)
        }
    }
}
</script>
<style scoped lang="less" src="@/views/task/taskDetails/taskDetails.less"></style>
<style scope lang="less">
::v-deep .my-label {
  background-color: red;
}
</style>
<style scoped>
::v-deep .ql-editor li {
  list-style-type: decimal !important;
  list-style-position: inside !important;
}
::v-deep .ql-editor ul > li:before {
  content: '\2022';
}

::v-deep .ql-editor ul > li::marker {
  content: '';
  display: none;
}

::v-deep .ql-editor li:before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
</style>
